<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>layui</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <link rel="stylesheet" href="../../lib/layui-v2.6.3/css/layui.css" media="all">
    <link rel="stylesheet" href="../../css/public.css" media="all">
    <style>
        body {
            background-color: #ffffff;
        }
    </style>
</head>
<body>

<form id="terminal_edit_form" class="layui-form layuimini-form">
    <input type="hidden" id="id" name="id">
    <input type="hidden" id="appId" name="appId">
    <input type="hidden" id="funcId" name="funcId">

    <div class="layui-form-item">
        <label class="layui-form-label required">序列号(SN)</label>
        <div class="layui-input-block">
            <input type="text" readonly name="sn" placeholder="请输入序列号(SN)" lay-verify="required" lay-reqtext="序列号(SN)不能为空" value="" class="layui-input">
        </div>
    </div>

    <div class="layui-form-item">
        <label class="layui-form-label required">应用名称</label>
        <div class="layui-input-block">
            <input type="text" readonly name="appName" placeholder="应用名称" lay-verify="required"  value="" class="layui-input">
        </div>
    </div>

    <div class="layui-form-item">
        <label class="layui-form-label required">功能名称</label>
        <div class="layui-input-block">
            <input type="text" readonly name="funcName" placeholder="功能名称" lay-verify="required"  value="" class="layui-input">
        </div>
    </div>

    <div class="layui-form-item">
        <label class="layui-form-label required">型号</label>
        <div class="layui-input-block">
            <input type="text" name="terminalType" placeholder="请输入型号" lay-verify="required" lay-reqtext="型号不能为空" value="" class="layui-input">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">有效期</label>
        <div class="layui-input-block">
            <select id="expiryType" name="expiryType" lay-filter="expiryType" lay-verify="required" lay-reqtext="请输选择有效期">
                <option value=""></option>
                <option value="03">3个月</option>
                <option value="12">12个月</option>
                <option value="24">24个月</option>
                <option value="P">永久有效</option>
            </select>
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">安装地址</label>
        <div class="layui-input-block">
            <input type="text" name="position" placeholder="请输入安装地址" value="" class="layui-input">
        </div>
    </div>
</form>
<script src="../../lib/layui-v2.6.3/layui.js" charset="utf-8"></script>
<script src="../../lib/jquery-3.4.1/jquery-3.4.1.min.js" charset="utf-8"></script>
<script src="../../js/my.js" charset="utf-8"></script>
<script>
    layui.use(['form'], function () {
        let form = layui.form,
            layer = layui.layer,
            $ = layui.$;

        $.ajaxSetup({
            headers: {'Access-Token': sessionStorage.getItem('token'), 'userId': sessionStorage.getItem("userId")}
        });

        const host = `${window.location.protocol}//${window.location.host}`;
        // 初始化应用选项
        $.get(`${host}/app/selectList`, (rest) => {
            if (rest.code === "00") {
                $.each(rest.data, function (index, item) {
                    let option = new Option(item.text, item.value);
                    $('#appId').append(option);
                });
            }
            form.render("select");
        });

        form.on('select(appId)', (data) => {
            func_init(data.value);
        })

        function func_init(appId, funcId) {
            $('#func-d').html("");
            $.get(`${host}/func/selectList`,{'appId': appId}, (rest) => {
                if (rest.code === "00") {
                    $.each(rest.data, function (index, item) {
                        if (rest.data.length === 1 || item.value == funcId) {
                            let func_checkbox = '<input type="radio" checked name="funcId" title="' + item.text + '" value = "' + item.value + '"  />';
                            $(func_checkbox).appendTo('#func-d');
                        } else {
                            let func_checkbox = '<input type="radio" name="funcId" title="' + item.text + '" value = "' + item.value + '" />';
                            $(func_checkbox).appendTo('#func-d');
                        }
                    });
                    form.render();
                }
            });
        }
    });

    var callbackData = function () {
        let formData = $("#terminal_edit_form").serializeObject();
        return formData;
    }
</script>
</body>
</html>